<script setup lang="ts">
defineProps({
  size: Number,
  scale: Number,
  avatarSvg: String,
  avatarUrl: String
})
</script>

<template>
  <el-avatar :style="{width: size + 'px', height: size + 'px'}" v-if="avatarUrl" :src="avatarUrl"/>
  <div v-else class="avatar-svg center" :style="{transform: `scale(${scale})`}" v-html="avatarSvg"></div>
</template>

<style scoped lang="scss">
.avatar-svg {
  width: 60px;
  height: 60px;
}
</style>